<template>
    <div class="app-container">
        <el-row class="app-search-container">
            <el-col :span="24">
                <el-form :inline="true" class="search-form">
                    <el-form-item label="资源名称">
                        <el-input placeholder="请输入资源名称"></el-input>
                    </el-form-item>
                    <el-form-item label="来源单位">
                        <el-input placeholder="请输入来源单位"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary">查询</el-button>
                        <el-button>重置</el-button>
                    </el-form-item>
                </el-form>
            </el-col>
        </el-row>
        
        <el-table :data="data" height="80vh">
            <el-table-column prop="name" label="资源名称"></el-table-column>
            <el-table-column prop="dept" label="来源单位"></el-table-column>
            <el-table-column prop="dataNum" label="数据量"></el-table-column>
            <el-table-column prop="incLastDay" label="昨日增量"></el-table-column>
            <el-table-column prop="incLastMonth" label="近30日增量"></el-table-column>
            <el-table-column label="详情">
                <template #default="scope">
                    <a class="app-link">详情</a>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';

const data = ref([
    {
        name: 'aa',
        dept: 'aa',
        dataNum: 100,
        incLastDay: 10,
        incLastMonth: 100
    },
    
])

</script>

<style scoped>
.app-container {
    padding: 20px;
    .app-link {
        color: #409eff;
        cursor: pointer;
        &:hover {
            text-decoration: underline;
        }
    }
    .app-search-container {
        margin-bottom: 20px;
        padding-left: 20px;
        padding-top: 20px;
    }
}

</style>